<template>
  <div class="base-info">
    <p></p>
    <ul class="">
      <li v-for="(item,index) in baseInfo" :key="index">
        <span>{{item[propsConfig.name]}}：</span>
        <span>{{item[propsConfig.info] || '无'}}</span>
      </li>
    </ul>
  </div>
</template>

<script>
/**
* 文字展示详情页面
* */
export default {
  props: {
    baseInfo: {
      type: Array,
      default() {
        return []
      }
    },
    propsConfig: {
      type: Object,
      default() {
        return {
          name: 'name',
          info: 'info'
        }
      }
    }
  }
}
</script>
<style lang="stylus" scoped>
.base-info{
  width: 100%;
  background:rgba(255,255,255,1);
  padding-bottom 12px
  p{
    height: 1px;
  }
  ul{
    width: calc(100% - 24px);
    margin 0 auto;
    li{
      display: flex;
      flex-flow: row nowrap;
      align-items flex-start;
      justify-content flex-start;
      margin-top: 12px;
      span:nth-child(1){
        font-size:14px;
        font-family:PingFangSC-Regular;
        font-weight:400;
        color:rgba(51,51,51,1);
        white-space nowrap;
      }
      span:nth-child(2){
        font-size:14px;
        font-family:PingFangSC-Regular;
        font-weight:400;
        color:rgba(102,102,102,1);
      }
      &:first-child{
        margin-top 16px;  
      }
      // &:last-child{
      //   margin-bottom 12px;  
      //   span{
      //     margin-bottom 12px;
      //   }
      //   min-height 28px;
      // }
    }
  }
}
</style>
